<!doctype html>
<!-- Simple test for

     https://svgwg.org/svg2-draft/styling.html#WidthProperty
     https://svgwg.org/svg2-draft/styling.html#HeightProperty

     "For backwards compatibility, when the 'width' or 'height'
      properties are specified as a presentation attributes, only the
      values that match the <length> production shall be mapped to
      CSS. Any other value must be treated as invalid." -->
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<span style="width:200px">
  <svg id="svg"></svg>
  <svg width="400">
    <foreignObject id="fO">
    </foreignObject>
  </svg>
</span>
<script>
    function setWidth(selector, width) {
        try { document.querySelector(selector).setAttribute('width', width); } catch (err) {}
    }
    function getWidth(selector) {
        return document.querySelector(selector).getBoundingClientRect().width;
    }
    var invalid_widths = [ 'auto', 'initial', 'inherit', 'foo' ];
    invalid_widths.forEach(function(invalid_width) {
        setWidth('#svg', invalid_width);
        test(function() {
            assert_equals(getWidth('#svg'), document.body.clientWidth);
        }, "Test width '" + invalid_width + "' on SVGSVGElement");

        setWidth('#fO', invalid_width);
        test(function() {
            assert_equals(getWidth('#fO'), 0);
        }, "Test width '" + invalid_width + "' on SVGForeignObject");
    });
</script>
